import 'package:flutter/material.dart';
import 'package:flutter_template/generated/i18n.dart';
import 'package:get/get.dart';
import 'package:flutter_template/provider/index.dart';
import 'package:flutter_template/utils/path.dart';

class SettingPage extends StatefulWidget {
  SettingPage({Key key}) : super(key: key);
  @override
  _SettingState createState() => _SettingState();
}

class _SettingState extends State<SettingPage> {
  String cacheSize = "0";
  @override
  void initState() {
    super.initState();
    PathUtils.loadCache().then((value) => {
	  setState(() {
	    cacheSize = value;
      })
    });
  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(I18n.of(context).page_setting),
      ),
      body: ListView(
        children: <Widget>[
		  Container(
			decoration: BoxDecoration(
			  color: Theme.of(context).canvasColor,
			  border: Border(bottom:BorderSide(width: 1,color: Theme.of(context).dividerColor))
			),
		    child:ExpansionTile(
		      title: Row(
			    children: <Widget>[
                  Icon(Icons.color_lens,color: Theme.of(context).primaryColor),
                  Padding(padding: EdgeInsets.only(left: 10.0),child: Text(I18n.of(context).theme))
			    ]
			  ),
			  children: <Widget>[
			    Wrap(
			      children:AppTheme.materialColors.asMap().keys.map((value) {
                    return InkWell(
                      onTap: () {
                        Store.value<AppTheme>(context).changeColor(value);
                      },
                      child: new Container(
                        margin: EdgeInsets.all(5.0),
                        width: 36.0,
                        height: 36.0,
                        color: AppTheme.materialColors[value],
                      ),
                    );
				  }).toList()
			    )
			  ]
		    ),
		  ),
		  Container(
			decoration: BoxDecoration(
			  color: Theme.of(context).canvasColor,
			  border: Border(bottom:BorderSide(width: 1,color: Theme.of(context).dividerColor))
			),
		    child:ListTile(
		      title: Row(
			    children: <Widget>[
                  Icon(Icons.language,color: Theme.of(context).primaryColor),
                  Padding(padding: EdgeInsets.only(left: 10.0),child: Text(I18n.of(context).language))
			    ]
			  ),
			  trailing: Icon(Icons.keyboard_arrow_right),
			  onTap: () {
			    Get.toNamed("/system/language");
			  }
		    ),
		  ),
		  Container(
			decoration: BoxDecoration(
			  color: Theme.of(context).canvasColor,
			  border: Border(bottom:BorderSide(width: 1,color: Theme.of(context).dividerColor))
			),
		    child:ListTile(
		      title: Row(
			    children: <Widget>[
                  Icon(Icons.cached,color: Theme.of(context).primaryColor),
                  Padding(padding: EdgeInsets.only(left: 10.0),child: Text(I18n.of(context).cache))
			    ]
			  ),
			  trailing: Text(cacheSize),
			  onTap: () {
			    PathUtils.clearCache();
			  }
		    ),
		  ),
		  Container(
			decoration: BoxDecoration(
			  color: Theme.of(context).canvasColor,
			  border: Border(bottom:BorderSide(width: 1,color: Theme.of(context).dividerColor))
			),
		    child:ListTile(
		      title: Row(
			    children: <Widget>[
                  Icon(Icons.error_outline,color: Theme.of(context).primaryColor),
                  Padding(padding: EdgeInsets.only(left: 10.0),child: Text(I18n.of(context).about))
			    ]
			  ),
			  trailing: Icon(Icons.keyboard_arrow_right),
			  onTap: () {
			    Get.toNamed("/system/about");
			  }
		    ),
		  ),
        ],
      )
    );
  }
}
